import { ml_Toast } from '../../../utils/asyncWX';
const app = getApp();
var ctx;
var fontSize = 20 //字体大小
var fontFamily = "SimHei" //字体
var code = null //验证码文本
Page({
  //验证码生成
  crash() {
    this.drawPic(this)
  },

  /**绘制验证码图片**/
  // 参考文章：https://blog.csdn.net/ZB66ZB66/article/details/109383116?utm_medium=distribute.pc_relevant.none-task-blog-baidujs_title-1&spm=1001.2101.3001.4242
  drawPic(that) {
    const query = wx.createSelectorQuery()
    query.select('#myCanvas')
      .fields({
        node: true,
        size: true
      })
      .exec((res) => {
        const canvas = res[0].node
        const ctx = canvas.getContext('2d')
        //清除画布
        ctx.fillStyle = "rgb(255, 255, 255)";
        ctx.fillRect(0, 0, 91, 36)
        /**绘制背景色**/
        ctx.fillStyle = that.randomColor(180, 240); //颜色若太深可能导致看不清
        ctx.fillRect(0, 0, that.data.width, that.data.height)
        /**绘制文字**/
        var arr;
        var text = '';
        var str = 'ABCEFGHJKLMNPQRSTWXY1234567890';
        var code_temp = "";
        for (var i = 0; i < that.data.count; i++) {
          var txt = str[that.randomNum(0, str.length)];
          code_temp += txt;
          ctx.fillStyle = that.randomColor(50, 160); //随机生成字体颜色
          ctx.font = that.randomNum(fontSize, fontSize + 6) + 'px ' + fontFamily; //随机生成字体大小
          var x = 10 + i * 20;
          var y = that.randomNum(25, 30);
          var deg = that.randomNum(-30, 30);
          //修改坐标原点和旋转角度
          ctx.translate(x, y);
          ctx.rotate(deg * Math.PI / 180);
          ctx.fillText(txt, 5, 0);
          text = text + txt;
          //恢复坐标原点和旋转角度
          ctx.rotate(-deg * Math.PI / 180);
          ctx.translate(-x, -y);
        }
        code = code_temp;
        // console.log(code)
        this.setData({ text: code })
        /**绘制干扰线**/
        for (var i = 0; i < 4; i++) {
          ctx.strokeStyle = that.randomColor(40, 180);
          ctx.beginPath();
          ctx.moveTo(that.randomNum(0, that.data.width), that.randomNum(0, that.data.height));
          ctx.lineTo(that.randomNum(0, that.data.width), that.randomNum(0, that.data.height));
          ctx.stroke();
        }
        /**绘制干扰点**/
        for (var i = 0; i < 20; i++) {
          ctx.fillStyle = that.randomColor(0, 255);
          ctx.beginPath();
          ctx.arc(that.randomNum(0, that.data.width), that.randomNum(0, that.data.height), 1, 0, 2 * Math.PI);
          ctx.fill();
        }
      })
  },
  randomNum: function (min, max) {
    return Math.floor(Math.random() * (max - min) + min);
  },
  /**生成一个随机色**/
  randomColor: function (min, max) {
    var that = this
    var r = that.randomNum(min, max);
    var g = that.randomNum(min, max);
    var b = that.randomNum(min, max);
    return "rgb(" + r + "," + g + "," + b + ")";
  },

  /**
   * 页面的初始数据
   */
  data: {
    //验证码属性
    text: '', //验证码
    count: 4,
    width: 92,
    height: 35,
    chiose: '',
    div_phone: '',
    div_password: '',
    div_code: ''
  },
  div_phone(e) { this.setData({ div_phone: e.detail.value }) },
  div_password(e) { this.setData({ div_password: e.detail.value }) },
  div_code(e) { this.setData({ div_code: e.detail.value }) },
  checkboxChange(e) {
    let data = e.detail.value; let index;
    if (data.indexOf('add') != -1) {
      index = 1;
    } else if (data.indexOf('pus') != -1 && data.indexOf('add') == -1) {
      index = 0;
    }
    this.setData({ chiose: index });
  },

  ifnone() {
    let div_password = this.data.div_password;
    let div_phone = this.data.div_phone;
    if (div_phone == '') { return '请填写手机号码！' }
    if (div_phone.length < 10 || div_phone.length > 12) { return '手机号码长度不符合规范！' }
    if (div_password == '') { return '请填写登录密码！' }
    console.log(div_password.length)
    if (div_password.length < 6) { return '登录密码大于6位！' }
    return 200;
  },
  //登录
  submit() {
    // 登录，当登录成功后把字符保存到本地
    if (this.ifnone() == 200) {
      if (this.data.div_code == this.data.text) {      //判断验证码是否正确
        wx.cloud.database().collection('rider_inf').where({rider_password:this.data.div_password,rider_phone:this.data.div_phone}).get().then(res=>{
          console.log(res)
          if(res.data.length == 0){
            ml_Toast('账号或密码不对，请重新输入！');
          }else{
            if(this.data.chiose == 0){
              wx.setStorageSync('rider_inf_reb',res.data[0]);
            }else if(this.data.chiose == 1){
              wx.setStorageSync('rider_inf_data',res.data[0]);
            }
            app.globalData['rider_inf'] = res.data[0];
            wx.navigateTo({
              url: '/packageA/pages/rider_hall/rider_hall',
            })
          }
        })
      } else {
        ml_Toast('验证码错误！请重新填写！');
      }
    }else{
      ml_Toast(this.ifnone());
    }

  },



  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.crash();
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})